<div class="viewerContainer">
  <div class="viewerContentContainer" [ngStyle]="rotateStyle">
    <img #img [src]="imageUri" class="imageStyle" [ngStyle]="imageStyle" (load)="onImageLoaded()"/>
    <canvas #canvas class="canvasStyle"></canvas>
  </div>
  <div *ngIf="isLoading" class="loadding">
      <div class="loadingImage">&nbsp;</div>
  </div>
  <div class="viewerOperationContainer">
      <ng-container *ngIf="canRotate">
          <button class="btn btn-danger" (click)="leftRotate()" [disabled]="isLoading">左 旋</button>&nbsp;&nbsp;
          <button class="btn btn-danger" (click)="rightRotate()" [disabled]="isLoading">右 旋</button>&nbsp;&nbsp;
      </ng-container>
      <ng-container *ngIf="canScale">
          <button class="btn btn-danger" (click)="scaleOut()" [disabled]="isLoading">放 大</button>&nbsp;&nbsp;
          <button class="btn btn-danger" (click)="scaleIn()" [disabled]="isLoading">缩 小</button>&nbsp;&nbsp;
      </ng-container>
      <ng-container *ngIf="canSetBrightness">
          <button class="btn btn-danger" (click)="brightnessUp()" [disabled]="isLoading">亮度+</button>&nbsp;&nbsp;
          <button class="btn btn-danger" (click)="brightnessDown()" [disabled]="isLoading">亮度-</button>&nbsp;&nbsp;
      </ng-container>
      <button class="btn btn-danger" (click)="onCloseViwer()" [disabled]="isLoading">关 闭</button>&nbsp;&nbsp;
  </div>
</div>